<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
	<title>好森活网上商城</title>
	<meta name="Keywords=" content="好森活网上商城">
	<meta name="Description" content="好森活网上商城">
	<link rel="stylesheet" href="./css/common.css">
	<link rel="stylesheet" href="./css/index.css">
	<link rel="stylesheet" href="./css/base2018.css">
	<link rel="stylesheet" href="./css/user.css">
	<script src="./js/jquery.js"></script>
</head>
<body>
<div class="box">
	<!-- top -->
	<script src="./template/top.js"></script>
	<!-- head -->
	<div class="hsh_head_bg">
		<div class="hsh_head">
			<div class="head_logo fl">
				<a href="javascript:;"><img src="./img/user/logo.jpg" width="227" height="74" alt="好森活欢迎您"></a>
			</div>
		</div>
	</div>
	<div class="container clearfix">
		<div class="user_menu fl">
			<ul>
				<li>
					<dl>
						<dt>订单中心</dt>
						<dd><a href="javascript:;">我的订单</a></dd>
						<dd><a href="javascript:;">我的收藏</a></dd>
					</dl>
				</li>
				<li>
					<dl>
						<dt>个人中心</dt>
						<dd><a href="javascript:;">完善资料/个人资料</a></dd>
						<dd><a href="javascript:;">帐户关联</a></dd>
						<dd><a href="javascript:;">收货地址</a></dd>
					</dl>
				</li>
				<li>
					<dl>
						<dt>帮助中心</dt>
						<dd><a href="javascript:;">如何支付？</a></dd>
						<dd><a href="javascript:;">如何查看收藏？</a></dd>
						<dd><a href="javascript:;">其它帮助文章...</a></dd>
					</dl>
				</li>
			</ul>
		</div>
		<div class="user_content fr">
			<div class="user_info clearfix">
				<div class="topleft fl">
					<div class="avatar fl"><a href="javascript:;"><img src="./img/user/default_avatar.png" alt="头像"><p class="avatar-tips">修改头像</p></a></div>
					<div class="myinfo fl">
						<p><b>133****0000</b><span>欢迎您！</span></p>
						<div class="ref-info"><a class="fl" href="javascript:;">完善资料</a><a class="fl" href="javascript:;">修改密码</a></div>
					</div>
				</div>
				<div class="topmiddle fl">
					<ul class="clearfix">
						<li class="fl"><a href="javascript:;"><span class="dfk"></span><p>待付款</p><i>1</i></a></li>
						<li class="fl"><a href="javascript:;"><span class="dfh"></span><p>待发货</p><i>2</i></a></li>
						<li class="fl"><a href="javascript:;"><span class="dsh"></span><p>待收货</p><i>3</i></a></li>
						<li class="fl"><a href="javascript:;"><span class="dpj"></span><p>待评价</p><i>4</i></a></li>
					</ul>
				</div>
				<div class="topright fl">
					<ul>
						<li><a href="javascript:;"><p><i class="my_sc"></i>我的收藏</p><span>0</span></a></li>
						<li><a href="javascript:;"><p><i class="my_pj"></i>我的评价</p><span>0</span></a></li>
					</ul>
				</div>
				<div class="upload-model">
					<div class="section">
						<div class="sec_head clearfix"><span class="fl">修改头像</span><i class="fr"></i></div>
						<div class="sec_content">
							<div class="preview"><img src="./img/error.png" alt="头像"></div>
							<div class="sec_wrap">
								<div class="upload-drag"><input type="file" class="file-btn"><span>从电脑上传文件</span></div>
								<p>我们只接受jpg，jpeg，gif，png，bmp格式图像图像最大不要超过2Mb或2048Kb</p>
								<div class="btn-box">
									<div class="button blue">确定</div>
									<div class="button grey">取消</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
			<div class="my_order">
				<dl class="table">
					<dt class="clearfix"><span class="fl">最近订单</span><span class="fr"><a href="javascript:;">查看全部订单</a></span></dt>
					<dd style="margin-top: 20px;background: #fff;">
						<ul>
							<li class="clearfix" style="background: #F2F2F2;padding: 5px 10px;border: 1px solid #ddd;border-bottom: none;">2018-7-31 14:16:32</span><span style="float: right;">订单号: <em style="font-size: 13px;color: #000;">123465789</em></span></li>
							<li class="clearfix">
								<div class="fl" style="width: 40%;">
								    <ul>
								        <li class="clearfix" style="position: relative;padding: 10px;border: 1px solid #ddd;border-top: none;">
								        	<a class="fl" href="javascript:;" style="width: 78px;height: 78px;border: 1px solid #ddd;"><img src="./img/list/store1.jpg" width="78" height="78"></a>
								    		<div class="fl" style="margin-top: 30px;margin-left: 5px;"><p style="font-size: 18px;color: #FF3300;">￥156.00</p><p>恩替卡韦分散片(润众)</p></div><i style="position: absolute;right: 100px;top: 10px;">x1</i>
								    	</li>
								        <li class="clearfix" style="position: relative;padding: 10px;border: 1px solid #ddd;border-top: none;">
								        	<a class="fl" href="javascript:;" style="width: 78px;height: 78px;border: 1px solid #ddd;"><img src="./img/list/store1.jpg" width="78" height="78"></a>
								    		<div class="fl" style="margin-top: 30px;margin-left: 5px;"><p style="font-size: 18px;color: #FF3300;">￥156.00</p><p>恩替卡韦分散片(润众)</p></div><i style="position: absolute;right: 100px;top: 10px;">x1</i>
								    	</li>
								    </ul>
								</div>
								<div clss="fr" style="float: right;">123</div>
							</li>
						</ul>
					</dd>
				</dl>
			</div>
		</div>
	</div>
	<!-- footer -->
	<script src="./template/footer.js"></script>
</div>
<script>
	// file上传
	$('.upload-drag span').click(function(){
		$(".file-btn").click()
	});
	// 修改头像
	$(".avatar a").click(function(){
		$(".upload-model").show();
	});
	// 关闭修改头像
	$(".sec_head i, .btn-box .grey").click(function(){
		$(".upload-model").hide();
	});
</script>
</body>
</html>